/*
 * admin  apikey列表搜索
 * @Author: ljb
 * @Date: 2018-03-27 17:51:07
 * @Last Modified by: ljb
 * @Last Modified time: 2019-11-11 09:23:19
 */
<style lang="less" rel="stylesheet/less" type="text/less">
.user-search-form {
  width: 1186px;
  .ivu-form-item-label {
    font-size: 16px;
    padding-left: 0px !important;
  }
}
</style>

<template>
  <Form
    ref="formInline"
    name="user_query__form"
    class="user-search-form"
    inline
    @keydown.native.enter.prevent="confirmSearch"
  >
    <Form-item :label-width="80" label="用户名称">
      <i-input
        v-model="formValidate.user"
        placeholder="请输入用户名"
        name="admin_query__username"
        size="large"
      />
    </Form-item>

    <Form-item :label-width="80" label="apikey_id">
      <i-input
        v-model="formValidate.apikey_id"
        placeholder="请输入apikey_id"
        name="admin_query__apikey_id"
        size="large"
      />
    </Form-item>

    <Form-item :label-width="104" label="apikey_name">
      <i-input
        v-model="formValidate.apikey_name"
        placeholder="请输入apikey_name"
        name="admin_query__apikey_name"
        size="large"
      />
    </Form-item>

    <Form-item :label-width="98" label="apikey状态">
      <Select
        v-model="formValidate.status"
        :style="{width: '150px'}"
        name="user_query__status"
        size="large"
        clearable
      >
        <Option
          v-for="option in options"
          :value="option.value"
          :key="option.value"
        >{{ option.label }}</Option>
      </Select>
    </Form-item>

    <Form-item>
      <Button type="primary" name="user_query__search" @click="confirmSearch">搜索</Button>
    </Form-item>

    <Form-item style="padding-left:10px">
      <Button type="primary" name="created_apikey" @click="createApi">新建ApiKey</Button>
    </Form-item>
  </Form>
</template>
<script>
export default {
  data() {
    return {
      options: [
        {
          value: "normal",
          label: "normal"
        },
        {
          value: "user-locked",
          label: "user-locked"
        },
        {
          value: "admin-locked",
          label: "admin-locked"
        },
        {
          value: "unactive",
          label: "unactive"
        }
      ],

      formValidate: {
        user: "",
        apikey_id: "",
        apikey_name: "",
        status: ""
      } // 搜索框的对象参数
    };
  },

  methods: {
    /**
     * 确认搜索
     * @return {undefined}
     */
    confirmSearch() {
      this.$emit("search", this.formValidate);
	},
	createApi(){
      this.$emit("create")
	}
  }
};
</script>
